<!doctype html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>已取消支付的订单</title>

    <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>


    <script type="text/javascript">
        $(function () {

            $.ajax({
                url: '/getCancelOrders',
                type: 'POST',    //GET
                async: false,    //或false,是否异步
                data: {},
                timeout: 5000,    //超时时间
                dataType: 'json', //返回的数据格式：json/xml/html/script/jsonp/text
                success: function (data) {
                    console.log(data);
                    var $dataId = $("#dataId");
                    for (var i = 0; i < data.length; i++) {
                        var state = data[i].state === 3 ? "已取消" : data[i].state
                        $dataId.append("" +
                            "<tr>" +
                            "   <td>" + data[i].orderId + "</td>" +
                            "   <td>" + state + "</td>" +
                            "</tr>")

                    }
                }
            })
        });

    </script>
</head>
<body>


<form>
    <table id="dataId">
        <tr>
            <td align="center"><span>订单号</span></td>
            <td align="center"><span>状态</span></td>
        </tr>
    </table>
</form>

</body>
</html>
